<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		
			因为浏览器的安全策略----同源策略(域名,协议,端口号一致)
			
			跨域: 只要域名,协议(http/https),端口号,一个不同就不能获取数据
			
			客户端:
			http://127.0.0.1:8848/a2022_03/JS%E9%83%A8%E5%88%86/day0816-17/axios4.html
			
			服务器: 
			http://localhost:9999/user/login
			
			
			跨域的解决方案(必须后台没做拦截):
			1. cross   服务器
			
			1.1 设置白名单
			let safeList = ["http://127.0.0.1:8848","http://127.0.0.1:5500", "http://127.0.0.1:3000", "http://127.0.0.1:8080"];
			
			let origin = req.headers.origin || req.headers.referer || "";
			origin = origin.replace(/\/$/g, '');
			origin = !safeList.includes(origin) ? '' : origin;
			res.header("Access-Control-Allow-Origin", origin);
			
			1.2
			res.header("Access-Control-Allow-Origin",'*');;//* 任何网站都可以访问
			res.header("Access-Control-Allow-Credentials", false);
			//必须不予许携带跨域资源凭证 就算设置为true，也不允许携带资源凭证

			2. proxy   代理  客户端 **** vue 重新学(nodejs/webpack/nginx)
			
			3. jsonp   客户端-----get类
			  script(js)\link(css)\img(图片)  不受域的限制，只能用于获取数据，发送的请求是get
			  script 来跨域
			
			4. 其他不常用的(了解)
			postMessage、window.name、document.domin、location.hash、...这些方案结合 iframe 也可以实现跨域处理
			
			工作中你平时用不用跨域?---一定用
			1.大公司(图片,下载资料,....)
			2.小公司(开发一定跨域,打包后可以放到一个服务器上,就不需要跨域了)
			
		
		<!-- <script src="axios.min.js"></script> -->
	<!-- 	<script>
			axios.get("http://127.0.0.1:1001/list")
			.then(response=>{
				console.log(response);
			})
		</script> -->
		
		<!-- <script>
			function funcc(value){
				console.log(value);
			}
		</script>
		<script src="http://127.0.0.1:1001/user/list?callback=funcc"></script> -->
		<script src="jsonpa.js"></script>
		<script>
			jsonp("http://127.0.0.1:1001/user/list",{
				jsonpName:'callback'
			}).then(value=>{
				console.log(value);
			}).catch(err=>{
				console.log(err);
			})
		</script>
		
	</body>
</html>
